<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport"
			content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<title>基本信息</title>
		<link rel="stylesheet" href="/mobile/css/weui.min.css">
		<link rel="stylesheet" href="/mobile/css/jquery-weui.min.css">
		<link rel="stylesheet" href="/mobile/layui/css/layui.css" />
		<link rel="stylesheet" href="/mobile/css/mobile.css" />
		
		<script src="/mobile/js/jquery.min.js"></script>
		<script src="/mobile/layui/layui.js"></script>
		<script src="/mobile/js/jquery-weui.min.js"></script>
	</head>
	<body>
		
		<div class="main" style="border-top: 1px solid #e5e5e5;">
			<div class="order_hd" style="padding-top: 15px;align-items:center; justify-content:center;border-bottom:none;">
				<div style="text-align:center;" id="ID-upload-demo-btn1">
				    <div style="width:120px;height:120px;border-radius:100%;overflow:hidden;margin-bottom:10px;">
				        <img id="image" src="{$user.avatar}" style="width:100%;height:100%" />
				        <input type="hidden" name="avatar" id="avatar" value="{$user.avatar}" />
				    </div>
				    点击更换
				</div>
				
			</div>
			
			<div class="order_bd">
				<div class="weui-cells weui-cells_form">
					
				  <div class="weui-cell">
				    <div class="weui-cell__hd"><label for="" class="weui-label">昵称</label></div>
				    <div class="weui-cell__bd">
				      <input class="weui-input" type="text" id="nickname" maxlength="10"  value="{$user.nickname}">
				    </div>
				  </div>
				  
				  <div class="weui-cell">
				      <div class="weui-cell__hd"><label class="weui-label">性别</label></div>
				      <div class="weui-cell__bd">
				        <div class="layui-form">
            			  <input type="radio" name="gender" value="0" title="男"  {if($user.gender==0)}checked{/if}>
            			  <input type="radio" name="gender" value="1" title="女" {if($user.gender==1)}checked{/if}> 

            			</div>
				      </div>
				  </div>
				  <div class="weui-cell">
				      <div class="weui-cell__hd"><label class="weui-label">年龄</label></div>
				      <div class="weui-cell__bd">
				        <input class="weui-input" type="number" min="18" max="99" id="age" value="{$user.age}">
				      </div>
				  </div>
				 
				  
				</div>
			</div>
		    
		    <div class="btn" style="margin-top:30px;">
			  <button type="button" class="layui-btn layui-btn-fluid layui-btn-normal layui-btn-radius" onclick="submit()">保存</button>
			</div>
		</div>
		
	</body>
	<script>

	layui.use(function(){
	  var upload = layui.upload;  
	  var form = layui.form;
	  var layer = layui.layer;
	  // 单图片上传
      var uploadInst = upload.render({
        elem: '#ID-upload-demo-btn1',
        url: '/api.php/common/upload', // 实际使用时改成您自己的上传接口即可。
        before: function(obj){
          // 预读本地文件示例，不支持ie8
          obj.preview(function(index, file, result){
            $('#image').attr('src', result); // 图片链接（base64）
          });
          
          //layer.msg('上传中', {icon: 16, time: 0});
        },
        done: function(res){
            console.log(res);
          // 若上传失败
          if(res.code!=1){
            return layer.msg(res.msg);return false;
          }
          // 上传成功的一些操作
          $('#avatar').val(res.data.url);
        }
        
      });
	  
	});
	
	
	
	function submit(){
        if($('#avatar').val().trim()==''){
            layer.msg('请上传头像', {icon: 5});
            return false;
        }
        if($('#nickname').val().trim()==''){
            layer.msg('请填写昵称', {icon: 5});
            return false;
        }

        $.ajax({
          type:"POST",
          url:"/api.php/user/set_info",
          dataType:"json",
          data:{
              "avatar":$('#avatar').val(),
              "nickname":$('#nickname').val(),
              "gender":$('input[name="gender"]:checked').val(),
              "age":$('#age').val(),
          },
          success:function(res){
              console.log(res);

              if(res.code==0){
                  layer.msg(res.msg,{icon:5});
    
              }else{
                  layer.msg(res.msg,{icon:6},function(){

    				  window.location.href="{:url('index/home')}";
                  });
              }
          }
        });
    
} 
	</script>
</html>